<template>
  <div class="table-page-search-wrapper">
    <a-card :bordered="false" class="card-area">
      <a-form layout="vertical">
        <a-row :gutter="48">
          <a-col :md="6" :sm="12">
            <a-form-item label="院系">
              <a-select :disabled="selectMenu.yx.length === 1" allowClear showSearch
                        :filterOption="filterOption" v-model="queryParam.ssyxm">
                <a-select-option v-for="i in selectMenu.yx" :key="i.id" :value="i.dwh">{{ i.dwh }} {{ i.dwmc }}</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="12">
            <a-form-item label="学生类别">
              <a-select allowClear v-model="queryParam.xslbm">
                <a-select-option v-for="i in TYPE0075" :key="i.id" :value="i.code">{{ i.name }}</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="12">
            <a-form-item label="学生类型">
              <a-select allowClear v-model="queryParam.xslxm">
                <a-select-option v-for="i in TYPE0503" :key="i.id" :value="i.code">{{ i.name }}</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <span class="table-page-search-submitButtons">
              <a-button type="primary" @click="loadData()">查询</a-button>
              <a-button type="primary" @click="exportExcel">导出</a-button>
              <a-button style="margin-left: 8px"
                        @click="() => queryParam = {ssyxm: selectMenu.yx.length === 1 ? queryParam.ssyxm : ''}">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </a-card>

    <div class="table-page-search-result">
      <a-table
        ref="table"
        size="default"
        rowKey="key"
        bordered
        :loading="loading"
        :columns="columns"
        :dataSource="data"
        :alert="options.alert"
        :pagination="false"
        :scroll="{ x: 3000, y:600 }"
      >
      <span slot="serial" slot-scope="text, record, index">
        {{ record.ssyxmc !== '合计' ? index + 1  : ''}}
      </span>
      </a-table>
    </div>
  </div>
</template>

<script>
  import {mapState} from 'vuex'

  const selectArr = ['TYPE0075', 'TYPE0503']
  export default {
    data() {
      return {
        loading: false,
        data: [],
        visible: false,
        // 高级搜索 展开/关闭
        advanced: true,
        // 查询参数
        queryParam: {},
        columns: [
          {
            title: '序号',
            width: 80,
            scopedSlots: {customRender: 'serial'}
          },
          {
            title: '培养单位',
            // width: 120,
            dataIndex: 'ssyxmc',
          }
        ],
        // 院系表头
        options: {
          alert: {show: false}
        },
        selectMenu: {
          yx: [], // 院系
        }
      }
    },
    computed: {
      ...mapState({
        TYPE0075: state => state.app['TYPE0075'],
        TYPE0503: state => state.app['TYPE0503'],
      })
    },
    created() {
      selectArr.forEach(v => {
        this.$store.dispatch('app/setDictionary', v)
      })
      this.initSelectMenu()
    },
    methods: {
      initSelectMenu() {
        let allRequest = [
          this.$api.base.collegeAll()
        ]
        Promise.all(allRequest).then(res => {
          this.selectMenu = {
            yx: res[0].data
          }
          if (this.selectMenu.yx && this.selectMenu.yx.length == 1) {
            this.$set(this.queryParam, 'ssyxm', this.selectMenu.yx[0].dwh)
          }
          this.$nextTick(() => {
            this.loadData()
          })
        })
      },
      loadData() {
        this.loading = true
        this.$api.student.xwlxStatis(this.queryParam).then(res => {
          if (this.columns.length < 3) {
            this.initColumn(res.data)
          }
          let data = []
          let total = {
            ssyxmc: '合计'
          }
          res.data.forEach((d,index) => {
            if (data[data.length -1] && data[data.length -1].ssyxmc === d.ssyxmc) {
              data[data.length -1 ][`${d.nf}xsxw`] = d.xsxw
              data[data.length -1 ][`${d.nf}zyxw`] = d.zyxw
              data[data.length -1 ][`${d.nf}xj`] = d.xj
            } else {
              data[data.length] = {
                ssyxmc: d.ssyxmc,
                [`${d.nf}xsxw`]:d.xsxw,
                [`${d.nf}zyxw`]: d.zyxw,
                [`${d.nf}xj`]: d.xj
              }
            }
            total[`${d.nf}xsxw`] = (total[`${d.nf}xsxw`] || 0) + d.xsxw
            total[`${d.nf}zyxw`] = (total[`${d.nf}zyxw`] || 0) + d.zyxw
            total[`${d.nf}xj`] = (total[`${d.nf}xj`] || 0) + d.xj
          })
          data.push(total)
          this.data = data
        }).finally(() => {
          this.loading = false
        })
      },
      initColumn (data) {
        data.some(d => {
          this.columns.push({
            title: d.nf,
            children: [
              {
                title: '学术学位',
                dataIndex: `${d.nf}xsxw`,
                width: 100,
                key: `${d.nf}xsxw`,
              },
              {
                title: '专业学位',
                dataIndex: `${d.nf}zyxw`,
                width: 100,
                key: `${d.nf}zyxw`,
              },
              {
                title: '小计',
                dataIndex: `${d.nf}xj`,
                width: 80,
                key: `${d.nf}xj`,
              },
            ],
          })
          return d.nf === '合计'
        })
      },
      filterOption(value, op) {
        return op.componentOptions.children[0].text.indexOf(value) !== -1
      },
      exportExcel() {
        this.$export('/schoolRoll/xjxx/xwlxtjExp', this.queryParam)
      }
    }
  }
</script>
